<template>
  <a-select
    :placeholder="placeholder"
    show-search
    :filterOption="false"
	:disabled="disabled"
    @focus="searchKey = ''; pageNum = 1; getLabelList()"
    @search="searchCityData"
    @popupScroll="scroll"
    :loading="searchLoading"
    v-model="cityId"
    v-bind="options"
    @change="selectCity"
  >
    <a-select-option v-for="item in cityData" :value="item.code" :key="item.name">
      {{ item.code + '-' + item.name }}
    </a-select-option>
  </a-select>
</template>
<script>
import {tableMixins} from '@/utils/mixins'
import { getPageSimpleCityList } from '@/api/common'
import {cloneDeep, debounce} from 'lodash'
export default {
  name: 'SelectCity',
  mixins: [tableMixins],
  props: {
    placeholder: {
      type: String,
      default: '请选择城市'
    },
		disabled: {
		  type: Boolean,
		  value: false
		},
    value: {
      type: [String, Number],
      default: undefined
    },
    options: {
      type: Object,
      default: () => ({})
    }
  },
  model: {
    prop: 'value',
    event: 'change'
  },
  data() {
    return {
      cityId: undefined,
      searchKey: '',
      searchLoading: false,
      cityData: [],
	  newId:undefined
    }
  },
  created() {
    this.searchCityData = debounce(this.searchCityData, 800);
  },
  methods: {
    cloneDeep,
    searchCityData(searchKey) {
		this.newId=undefined
      this.searchKey = searchKey
      this.pageNum = 1
      this.getLabelList()
    },
    scroll(e) {
      const {scrollHeight, scrollTop, clientHeight} = e.target
      if (scrollHeight - scrollTop === clientHeight) {
        if (this.cityData.length === this.total) return
        this.pageNum++
        this.getLabelList()
      }
    },
    selectCity(cityCode,name) {
      // console.log(cityCode,name.key);
      // let cityname =name.key
      this.$emit('change', cityCode)
    },
	gitNew(data,name){
		console.log(data,'ssss')
		
		if(name){
				this.newId=data
			this.searchKey=''
			this.getLabelList()
			
			setTimeout(() => {
				
							 let val=this.cityData.find(item=>item.id==this.newId)					 
						this.cityId=val.code	
									this.selectCity(this.cityId)
			           return val.code
			     }, 1000);
		}else{
			this.newId=undefined
			this.searchKey=data.toString()
			this.getLabelList()
				
			setTimeout(() => {
												 
						this.cityId=data						
			  
			     }, 1000);
		}
		
	},
    getLabelList() {
      this.searchLoading = true
      getPageSimpleCityList({
        searchKey: this.searchKey.trim(),
		id:this.newId,
    pageSize: this.rowsNum,
        PageNo: this.pageNum
      }).then(res => {
        this.searchLoading = false
        const {items, rowCount} = res
        this.cityData = this.pageNum === 1 ? items : this.cityData.concat(items)
        this.total = rowCount
		
      }).catch(() => this.searchLoading = false)
    }
  }
}
</script>
